<template>
  <Portlet v-if="chServiceCollectionCostList.length > 0" title="代收款">
    <!--参考： src/views/oms/order/CreateService.vue -->
    <span slot="tools">
      <el-popover
        placement="right"
        width="400"
        trigger="hover">
        <span>
          ①该单需要用户扫描支付成功后师傅方可签收；<br>
          ②用户支付成功后代收金额进入钱包可以提现；<br>
          ③每笔代收款有0.28%的手续费，由三方支付平
            台双乾支付收取。如代收1000.00元，用户支
            付1000.00元，钱包实际到账997.20元。
        </span>
        <el-button slot="reference" type="text">代收款说明</el-button>
      </el-popover>
      <el-button type="primary" size="small" @click="cancel"
                 v-if="boolCollection == 1 && routeName === 'serviceOrdersShow'">取消代收款</el-button>
    </span>
    <el-row :gutter="15">
      <el-col :span="24">
        <el-table
          :data="chServiceCollectionCostList"
          border
          :summary-method="getSummaries"
          show-summary
          :header-cell-style="{'text-align': 'center'}"
          :cell-style="{'text-align': 'center'}"
          style="width: 100%">
          <el-table-column
            prop="clearingObjectName"
            align="center"
            label="结算主体">
          </el-table-column>
          <el-table-column
            prop="costName"
            label="费用名称">
          </el-table-column>
          <el-table-column
            prop="money"
            align="center"
            label="费用金额">
          </el-table-column>
          <el-table-column
            prop="boolCollection"
            label="代收状态">
            <template slot-scope="scope">
              {{ scope.row.boolCollection | boolCollectionFilter }}
            </template>
          </el-table-column>
          <el-table-column
            prop="payType"
            label="代收方式">
          </el-table-column>
          <el-table-column
            prop="realMoney"
            align="center"
            label="实际收款">
          </el-table-column>
          <el-table-column
            prop="procedureFee"
            align="center"
            label="手续费">
          </el-table-column>
          <el-table-column
            prop="memo"
            label="代收备注">
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>
  </Portlet>
</template>
<script>
import {dotData, confirm} from '@/utils'
import {filterDataBaseDictionary, decimalNumFilter} from '@/filters'
export default {
  name: 'paymentForGoods',
  components: {
  },
  filters: {
    filterDataBaseDictionary,
    boolCollectionFilter(val) {
      switch (parseInt(val)) {
        case 0 :
          return '已取消'
        case 1 :
          return '未支付'
        case 2 :
          return '已支付'
        default:
          return val
      }
    }
  },
  props: {
    detail: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      loading: false,
      innerVisible: false,
      routeName: this.$route.name
    }
  },
  computed: {
    //  table数据 + 代收状态
    // orderCollectionList() {
    chServiceCollectionCostList() {
      return dotData(this.detail, 'chServiceCollectionCostList') || []
    },
    // 师傅能取消代收货款 等于1 能取消
    boolCollection() {
      return dotData(this.detail, 'chOrder.boolCollection')
    },
    orderId() {
      return dotData(this.detail, 'chOrder.id')
    }
  },
  methods: {
    decimalNumFilter,
    // 求和
    getSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        const values = data.map(item => Number(item[column.property]))
        if (index === 0) {
          sums[index] = '合计'
        } else {
          if (column.property === 'volume' || column.property === 'money' || column.property === 'realMoney' || column.property === 'procedureFee') {
            let temp = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return prev + curr
              } else {
                return prev
              }
            }, 0)
            // sums[index] = decimalNumFilter(temp)
            sums[index] = decimalNumFilter(temp, (column.property === 'money' || column.property === 'realMoney' || column.property === 'procedureFee') ? 2 : 0)
          } else {
            sums[index] = ''
          }
        }
      })
      return sums
    },
    cancel() {
      confirm('确定要取消代收款服务吗？取消后该订单将不再提供代收款服务，并且不能再次发起代收款服务。', '取消代收款', {
        confirmButtonLoading: true,
        type: 'waring',
        confirmCallBack: ({close, confirmButtonLoadingClose}) => {
          this.$ajax.post('/ms-warehouse-order/service-order-controller/omsCancelCollection', {orderId: this.orderId}).then(response => {
            confirmButtonLoadingClose()
            const success = dotData(response, 'success')
            if (success) {
              close().then(_ => {
                confirm('取消成功', undefined, {type: 'success'}).then(_ => {
                  this.$emit('refresh', true)
                })
              })
            }
          }).catch(_ => {
            confirmButtonLoadingClose()
          })
        }
      })
    }
  }
}
</script>
